<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>Entry</title>
		<style>
			.main {
				padding: 10px;
				margin: 10px auto;
				max-width: 250px;
				border: 2px solid green;
				border-radius: 10px;
				
				overflow: auto;
			}
			.right {
				float: right;
				margin: 0px 5px;
				/*clear: both;*/
			}
			.login {
				margin-top: 8px;
				border: 0px;
				padding: 5px 20px;
				background-color: coral;
			}
			.login:hover {
				background-color: #c36100;
			}
			.register {
				margin-top: 12px;
				text-decoration: none;
			}
			.register:hover {
				text-decoration: underline;
			}
		</style>
	</head>
	<body>
		<div class="main">
			<form method="post">
				<h1 style="text-align: center;">Login</h1>
				<input type="text" name="username" placeholder="Input user name." style="width: 95%;" /> <br />
				<input type="password" name="password" placeholder="Input password." style="width: 95%;" /> <br />
				<div style="text-align: left;">
					{% for message in get_flashed_messages() %}
					<div>{{ message }}</div>
					{% endfor %}
				</div>
				<button class="right login" type="submit" name="action" value="login"> Login </button>
			</form>
		</div>
	</body>
</html>
